<template>
    <main>
        <div id="main">
            <div class="head">
                <div class="head-content">
                    有趣视频-有趣段子、搞笑社区、内涵图
                </div>
            </div>
            <div class="menu">
                <ul>
                    <li>
                        <a href="#">有趣推荐</a>
                    </li>
                    <li>
                        <a href="#">视频</a>
                    </li>
                    <li>
                        <a href="#">图片</a>
                    </li>
                </ul>
            </div>
            <div class="content">
                <div class="content-left">
                    <div class="list">
                        <div class="list-title">
                            <div class="list-img">
                                <img src="../assets/img/ic_launcher.png" height="50px" width="50px" />
                            </div>
                            <div class="list-name">
                                <div class="title-style">标题标题标题</div>
                                <div class="date-style">2017-06-11 13：47</div>
                            </div>
                        </div>
                        <div class="list-content">内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容容内容内容</div>
                        <div>
                            <img class="list-picture" src="../assets/img/pic.jpg" />
                        </div>
                        <div>
                            <video class="list-video" controls="controls">
                                <source src="../assets/video/1497022307859.mp4" type="video/mp4"> 您的浏览器不支持此种视频格式。
                            </video>
                        </div>
                        <div style="margin-top:10px;">
                            <span class="list-lable">搞笑视频</span>
                        </div>
                        <div class="list-menu-text">
                            <img src="../assets/img/icon_like.png" height="30" width="30" style="float:left;" />
                            <div style="float:left; line-height:30px;margin-left:5px;">10</div>
                            <img src="../assets/img/icon_unlike.png" height="30" width="30" style="float:left; margin-left:20px;" />
                            <div style="float:left; line-height:30px;margin-left:5px;">10</div>
                            <img src="../assets/img/toolbar_icon_comment.png" height="30" width="30" style="float:left; margin-left:20px;" />
                            <div style="float:left; line-height:30px;margin-left:5px;">10</div>
                            <img src="../assets/../assets/img/icon_wish_highlighted.png" height="30" width="30" style="float:left; margin-left:20px;" />
                            <div style="float:left; line-height:30px;margin-left:5px;">10</div>
                            <div style="clear:both;"></div>
                        </div>
                    </div>
                </div>
                <div class="content-right">
                    <div class="right-top">搞笑段子、搞笑视频、内涵图、都在有趣视频
                        <br> http://www.youqushipin.com
                        <br> E-mail:1121217849@qq.com
                    </div>
                    <div class="right-top">
                        官方QQ交流群
                        <br /> 开发交流群:295063374
                    </div>
    
                </div>
                <div style="clear:both"></div>
            </div>
            <hr />
            <div class="foot">
                关于我们 | 帮助中心 | 联系我们 | Android
                <br /> 2017© 有趣视频 有趣段子 http://www.youqushipin.com | 皖ICP备17011244号-1
                <br /> 地址:合肥市蜀山区大唐国际14栋907室 | 联系电话：18856061699 | e-mail:1121217849@qq.com
            </div>
        </div>
    </main>
</template>

<style lang="less" scoped rel="stylesheet/less">
    @import './index.less';
</style>

<script type="text/javascript">

import { Header } from 'mint-ui';
import config from 'api';
export default {
    component: {
        Header
    },
    data() {
        return {
            value: '',
            booksList: [],
            cpContent: ''
        };
    },
    created() { },
    computed: {},
    methods: {
        // changSearch(value) {
        //     this.$http.get(`https://bird.ioliu.cn/v1/?url=${config.apis.bookSearch}`, {
        //         params: {
        //             query: value || '重生之娱乐星光',
        //             start: 0,
        //             limit: 10
        //         }
        //     }).then(({ data }) => {
        //         this.booksList = data.books.map(item => ({
        //             ...item,
        //             cover: item.cover.replace('/agent/', '')
        //         }));
        //         console.log(data.books)
        //     });
        // },
        search(value) {
            this.$http.get(`${config.apis.search}`, {
                params: {
                    keyword: value || '重生之娱乐星光',
                    start: 0,
                    end: 10
                }
            }).then(({ data }) => {
                this.booksList = data.data.books.map(item => ({
                    ...item,
                    cover: item.cover.replace('http://statics.zhuishushenqi.com/agent/', '')
                }));
                console.table(data.data.books)
            });
        },
        //获取章节目录  1.根据书籍的id拿到，优质书源的id  2.根据书源的id获取章节目录
        bookSources(id) {
            //书源
            this.$http.get(`${config.apis.bookSources}`, {
                params: {
                    view: 'summary',
                    book: id
                }
            }).then(({ data }) => {
                this.bookChapters(data.data[0]._id)
                console.log(data.data[0]._id)
            });
        },
        bookChapters(id) {
            //目录
            this.$http.get(`${config.apis.bookChapters}${id}`).then(({ data }) => {
                this.chapters(encodeURIComponent(data.data.chapters[140].link))
                // console.table(data.data.chapters)
            });
        },
        chapters(link) {
            //章节
            this.$http.get(`${config.apis.chapters}${link}`).then(({ data }) => {
                console.trace(`${config.apis.chapters}${link}`);
                this.cpContent = data.data.chapter.cpContent;
                console.info(data.data.chapter.cpContent)
                console.log(data.data.chapter.title)
            });
        }
    }
};
</script>